Element上传关键代码记录

html页面

<el-form-item label="供应商资质文件上传:"  prop="file" >
  <el-upload ref="upload" class="upload-demo" action="#" :on-change="handleFileChange"
      :auto-upload="true" :http-request="uploadChange"  :limit="50" >
      <el-button size="small" type="primary">上传供应商资质文件</el-button>
  </el-upload>
</el-form-item>

方法

// 提交
uploadChange(param, type) {
    console.log(param)
    let formData = new FormData()
    formData.append('file', param.file)
    // formData.append("id", this.id)//额外参数
     //formData.append("id", 111)//额外参数
     supplierqualification_uploadSupplierQualificationFileList(formData).then(res => {
      this.$message({
              type: 'info',
              message: res.message
          });
          //this.addModal = false;
          //this.pages();
      }).catch(error => {
              debugger;
          console.log(error);
      });
},

import {
    get,
    post
  } from '../utils/axios'
 
//提交
export function supplierqualification_uploadSupplierQualificationFileList(data) {
  return post(`/supplierqualification/uploadSupplierQualificationFileList`, data);
}

axios.js

import Vue from "vue";
import axios from "axios";

import { getToken,windowOpen} from '@/utils/auth' // get token from cookie
// 响应时间
axios.defaults.timeout = 600 * 1000;
Vue.prototype.$axios = axios;
// 配置cookie
// axios.defaults.withCredentials = true
// 配置请求头
// axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded'
// 静态资源
Vue.prototype.$static = "";
// 配置接口地址
//这里的接口地址是你地址的相同的前半部分，方便管理
// axios.defaults.baseURL = ''
// 发送请求
//post请求

if (process.env.NODE_ENV == "production") {
  axios.defaults.baseURL = "/api/";
} else {
  //测试
  axios.defaults.baseURL = 'http://127.0.0.1:8080'
}

axios.interceptors.request.use(
  config => {
      try {
        var userInfo = window.sessionStorage.getItem("userInfo");
        if(userInfo){
            let {loginname} = JSON.parse(userInfo)
            config.headers.loginName = loginname
            console.log("loginname",loginname);
            console.log("config.headers",config.headers);
        }
      } catch (e) {
          console.error(e)
      }
      return config
  },
  error => {
      return Promise.reject(error)
  }
)

export function post(url, params) {

   // const hasToken = getToken();
   // if (!hasToken) { // 判断当前的token是否存在
   //   //若没有跳转登录界面
   //   windowOpen();
   //   }else{
       return new Promise((resolve, reject) => {
         // console.log(1)
         // console.log()
         axios.post(axios.defaults.baseURL + url, params)
           .then(
             res => {
               resolve(res.data);
             },
             err => {
               reject(err.data);
             }
           )
           .catch(err => {});
       });
     // }

}
//get请求
export function get(url, params) {
   // const hasToken = getToken();
   // if (!hasToken) { // 判断当前的token是否存在
   //   //若没有跳转登录界面
   //   windowOpen();
   //   }else{
      return new Promise((resolve, reject) => {
        axios.get(axios.defaults.baseURL + url, {
            params: params
          })
          .then(res => {
            resolve(res.data);
          })
          .catch(err => {});
     });
  // }
}
//get请求
export function exp(url, params) {
  return new Promise((resolve, reject) => {
    axios
      .post(axios.defaults.baseURL + url, params, {
        responseType: "blob"
      })
      .then(response => {
        let fileName = window.decodeURI(
          response.headers["content-disposition"].split("=")[1]
        );
        let link = document.createElement("a");
        link.href = window.URL.createObjectURL(
          new Blob([response.data], {
            type:
              "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8"
          })
        );
        link.target = "_blank";
        link.download = fileName;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      });
  });
}